// components/Tabs/Tabs.js
Component({
    options: {
        multipleSlots: true // 在组件定义时的选项中启用多slot支持
    },
    /**
     * 组件的属性列表
     */
    properties: {
        tabs: {
            type: Array,
            value: [],
        },
    },

    /**
     * 组件的初始数据
     */
    data: {
        currentTabIndex: 0,
    },

    /**
     * 组件的方法列表
     */
    methods: {
        handleTabChange(e) {
            let { index } = e.currentTarget.dataset;
            // console.log(index);
            this.setData({
                currentTabIndex: index
            })

            //将子组件所点击的元素下标传递给父组件
            this.triggerEvent("change",{index})
        },
        handleTouchMove(e){
            let direction = e.direction
            let currentTabIndex = this.data.currentTabIndex
            let targetTabIndex = currentTabIndex + direction
            if(targetTabIndex < 0 || targetTabIndex > this.data.tabs.length - 1){
                return
            }
            const customEvent = {
                currentTarget: {
                    dataset: {
                        index: targetTabIndex
                    }
                }
            }
            this.handleTabChange(customEvent)
        }
    },
})
